<template>
  <div>
    <FilterTable
      ref="table"
      :columns="columns"
      :fetchapi="fetchApi"
      :params="fetchParams"
      :datakey="'records'"
      :isSelectColumn="false"
      :onColumnsChange="columns => this.columns = columns"
    >
    <template slot="controls">
      <el-button size="small" type="primary"   @click="addHandleBtn">新增</el-button>
    </template>
    </FilterTable>
    <BaseDialog
        :visible.sync="visible"
        :title="dialogTitle"
        destroyOnClose
        width="850px"
        :containerStyle="{height: '100%', overflow: 'auto'}">
        <AddPrograms :type="handleType" @close="closeHandler"></AddPrograms>
    </BaseDialog>
  </div>
</template>
<script>
import { salesServices, modifyValid } from '@/api/retail/basedata/maintenance'
import AddPrograms from './addPrograms'
import { dictionary } from '@/utils/dictMixin';
import moment from 'moment'
export default {
  name: 'RetailMaintenance',
  mixins: [dictionary],
  components: {
    AddPrograms
  },
  data () {
    return {
      fetchParams: {},
      fetchApi: salesServices,
      columns: this.createTableColumns(),
      visible: false,
      handleType: 'new',
      dialogTitle: '新增'
    }
  },
  created () {

  },
  mounted () {

  },
  methods: {
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '项目代码',
          dataIndex: 'serviceCode',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '项目名称',
          dataIndex: 'serviceName',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '费用类型',
          dataIndex: 'serviceType',
          sorter: true,
          filter: true,
          filterType: 'select',
          filterItems: this.createDictList('1421'),
          render: props => {
            return <span> { this.preDictHandler(props.row.serviceType,'1421')} </span>
          }
        },
        {
          title: '费用金额',
          dataIndex: 'directivePrice',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '停用',
          dataIndex: 'isValid',
          sorter: true,
          filter: true,
          filterType: 'input',
          render: props => {
            let isSwitch = props.row.isValid
            return <el-switch v-model={props.row.isValid} active-value='10041001' inactive-value='10041002' on-change={(newVal)=>{
              let params = {
                recordVersion: props.row.recordVersion,
                serviceId: props.row.serviceId,
                isValid: props.row.isValid
              }
              modifyValid(params).then(res => {
                if (res.success) {
                  console.log('修改成功')
                  this.fetchParams = { ...this.fetchParams };
                  // isSwitch = props.row.isValid = props.row.isValid == '10041001' ? '10041002':'10041001'
                } else {
                  // props.row.isValid = isSwitch
                  console.log('修改失败')
                }
              })
            }}></el-switch>
          }
        },
        {
          title: '停用日期',
          dataIndex: 'stopDate',
          sorter: true,
          filter: true,
          filterType: 'input',
          render: props => {
            return <span>{this.preDateHandler(props.row.stopDate, 'YYYY-MM-DD')}</span>
          }
        }
        // {
        //   title: '审核状态',
        //   dataIndex: 'auditStatus',
        //   sorter: true,
        //   filter: true,
        //   filterType: 'checkbox',
        //   filterItems: this.createDictList('1416'),
        //   render: props => {
        //     return <span>{ this.preDictHandler(props.row.auditStatus, '1416') }</span>;
        //   }
        // },
      ]
    },
    addHandleBtn () {
      //新增
      this.visible = true
    },
    closeHandler (val) {
      console.log(val)
      this.visible = false
      if (val === 'refresh') {
        this.fetchParams = { ...this.fetchParams };
      }
    },// 字典数据使用前预处理
    preDictHandler(val, code){
      let resultText = val && String.prototype.includes.call(val, code) ? this.createDictText(val, code) : val;
      return resultText;
    },
    // 日期预处理
    preDateHandler(val, formatCode='YYYY-MM-DD HH:mm:ss') {
      let resultDate = val ? moment(Number(val)).format(formatCode) : val;
      if ((resultDate == 'Invalid date' || resultDate == 'Invalid Date') && val) {
        resultDate = moment(val).format(formatCode)
      }
      return resultDate;
    },
  }
}
</script>
<style lang="less" scoped>
</style>
